<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>楼盘展示</title>
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=lcZA6Wfuiqjfpa6TdhYsEHyLoY6WD0Ny">
//v2.0版本的引用方式：src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"
//v1.4版本及以前版本的引用方式：src="http://api.map.baidu.com/api?v=1.4&key=您的密钥&callback=initialize"
		
</script>
<script src="bootstrap3/js/jquery-3.0.0.min.js"></script>
</head>

<body>
<div id="container"></div>
<script type="text/javascript">
$(function(){

	var url = "/map/pointall.do";
	var data = null;

	$.post(url, data, function(resp){
		if(1){
			var map = new BMap.Map("container");          // 创建地图实例
			//设置地图中心点
			var center = new BMap.Point(110.463819, 19.239415);
			map.centerAndZoom(center, 15); 
			
			//设置缩放控件
			var opts = {type: BMAP_NAVIGATION_CONTROL_SMALL}
			map.addControl(new BMap.NavigationControl(opts));
			
			// 复杂的自定义覆盖物
		    function ComplexCustomOverlay(point, text, mouseoverText){
		      this._point = point;
		      this._text = text;
		      this._overText = mouseoverText;
		    }
		    ComplexCustomOverlay.prototype = new BMap.Overlay();
		    ComplexCustomOverlay.prototype.initialize = function(map){
		      this._map = map;
		      var div = this._div = document.createElement("div");
		      div.style.position = "absolute";
		      div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
		      div.style.backgroundColor = "#EE5D5B";
		      div.style.border = "1px solid #BC3B3A";
		      div.style.borderRadius = "5px";
		      div.style.color = "white";
		      div.style.height = "18px";
		      div.style.padding = "2px";
		      div.style.lineHeight = "18px";
		      div.style.whiteSpace = "nowrap";
		      div.style.MozUserSelect = "none";
		      div.style.fontSize = "12px"
		      var span = this._span = document.createElement("span");
		      div.appendChild(span);
		      span.appendChild(document.createTextNode(this._text));      
		      var that = this;

		      var arrow = this._arrow = document.createElement("div");
		      arrow.style.background = "url(http://map.baidu.com/fwmap/upload/r/map/fwmap/static/house/images/label.png) no-repeat";
		      arrow.style.position = "absolute";
		      arrow.style.width = "11px";
		      arrow.style.height = "10px";
		      arrow.style.top = "22px";
		      arrow.style.left = "10px";
		      arrow.style.overflow = "hidden";
		      div.appendChild(arrow);
		     
// 		      div.onmouseover = function(){
// 		        this.style.backgroundColor = "#6BADCA";
// 		        this.style.borderColor = "#0000ff";
// 		        this.getElementsByTagName("span")[0].innerHTML = that._overText;
// 		        arrow.style.backgroundPosition = "0px -20px";
// 		      }

// 		      div.onmouseout = function(){
// 		        this.style.backgroundColor = "#EE5D5B";
// 		        this.style.borderColor = "#BC3B3A";
// 		        this.getElementsByTagName("span")[0].innerHTML = that._text;
// 		        arrow.style.backgroundPosition = "0px 0px";
// 		      }

		      div.onclick = function(){
		          var opts = {
		           width : 250,     // 信息窗口宽度
		           height: 100,     // 信息窗口高度
		           title : "联系置业顾问"  // 信息窗口标题
		          }
		          var infoWindow = new BMap.InfoWindow("<a href='http://baidu.com'>测试链接</a>", opts);  // 创建信息窗口对象
		          map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
		      }
		      map.getPanes().labelPane.appendChild(div);
		      
		      return div;
		    }
		    ComplexCustomOverlay.prototype.draw = function(){
		      var map = this._map;
		      var pixel = map.pointToOverlayPixel(this._point);
		      this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
		      this._div.style.top  = pixel.y - 30 + "px";
		    }
		   	//End 	复杂的自定义覆盖物	
			
		   	//解析json数据
		    $.each(resp, function(index, item) {
		    	var point = new BMap.Point(item.lng, item.lat);  // 创建点坐标
		    	var myCompOverlay = new ComplexCustomOverlay(point, item.projName, item.projName);
//		    	var marker = new BMap.Marker(point);        // 创建标注
		    	map.addOverlay(myCompOverlay);
		    });			
			return;
		}
	}, 'json');	
});


</script>
</body>
</html>


